import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    menus: [],
    roles: [],
  },
  getters: {
    userMenus(state) {
      // 从vuex中得到的数据显示， parentId 是 0 部分就是一级菜单 ， parentId 是某个一级菜单的部分，就是二级菜单
      // 构建思路： 1. 先找出所有的一级菜单 放到数组里面 ， 2. 再根据 一级菜单的 id ，把所有的二级菜单 的 parentId 进行比较， 如果一致，把二级菜单作为一级菜单的children
      let parents = [];
      let menus = state.menus;
      // 先找出所有的一级菜单
      menus.forEach((item) => {
        // parentId 是0 ，就是一级菜单  --  hidden 如果不是0， 其实也不是菜单
        if (item.parentId === 0 && item.hidden === 0) {
          // 准备好 children数组，便于后面直接放子级菜单进来
          item.children = [];
          parents.push(item);
        }
      });
      // 再找出所有的二级菜单
      menus.forEach((item) => {
        let p = parents.find((parent) => parent.id === item.parentId);
        // 找到了对应的一级菜单
        if (p && item.hidden === 0) {
          // 把二级菜单作为一级菜单的children
          p.children.push(item);
        }
      });
      return parents;
    },
  },
  mutations: {
    saveMenu(state, payload) {
      state.menus = payload;
    },
    saveRoles(state, payload) {
      state.roles = payload;
    },
  },
  actions: {},
  modules: {},
});
